{% extends "layout.html" %}
{% block myhead %}
<title>Main Page</title>
{% endblock %}
{% block mytitle %}
Main Page
{% endblock %}
{% block mybody %}
<h2 class="unselectable">Fruit List</h2>
<img src="{{url_for('static', filename=main_pic)}}" alt="tsbavatar" width="10%">
<ul class="mdui-list">
    {% for fruit in fruits %}
    <li class="mdui-list-item mdui-ripple">{{fruit}}</li>
    {% endfor %}
</ul>
<form action="{{url_for('main_page')}}" method="post">
    <div class="mdui-textfield mdui-textfield-floating-label">
        <label class="mdui-textfield-label">FruitName</label>
      <input class="mdui-textfield-input" type="text" name="fruit"/>
    </div>
    <button class="mdui-btn mdui-btn-raised mdui-ripple mdui-color-theme-accent">Add Fruit</button>
</form>
{% endblock %}
